<template>
	<view class="wrap">
		<view class="search">
			<!-- <u-search v-model="keywords" @custom="search" @search="search"></u-search> -->
		</view>
		<u-index-list :scrollTop="scrollTop">
			<view v-for="(item, index) in indexList" :key="index">
				<view v-for="(children,key) in item">
					<u-index-anchor :index="key" />
					<view class="list-cell" v-for="    (item,index) in children"
							:key="item.userId" :name="item.nickName">
						<image class="user-images" :src="getReandomImage(index)"></image>
						<view class="user-name"><span>{{item.nickName}}</span><span
						class="user-other">{{item.phonenumber}}</span></view>
					</view>
				</view>
			</view>
		</u-index-list>
		<u-divider>已经到底了</u-divider>
	</view>

</template>
<script>
	import HeadNavBar from '@/components/headnavbar/index';
	/**
	 * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
	 */
	export default {
		components: {
			HeadNavBar
		},
		data() {
			return {
				keywords: '',
				scrollTop: 0,
				indexList: [],
			imageList: ['user01', 'user02', 'user03', 'user04', 'user05', 'user06'],
			}
		},
		onLoad() {
			this.$u.api.userBloodTypelist().then(res => {
				if (res.code == '200') {
					this.indexList = res.data;
					console.log(this.indexList);
				} else if (res.code == '401') {
					uni.reLaunch({
						url: '/pages/sys/login/index'
					});
				} else {
					this.$u.toast("请登录后重试");
				}
			});
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		methods: {
			getRandomInt(min, max) {
				let data = Math.floor(Math.random() * (max - min + 1)) + min;
				return data;
			},
			getRandomName() {
				const length = this.nameList.length;
				const i = this.getRandomInt(0, length - 1);
				return this.nameList[i];
			},
			getRandomDept() {
				const length = this.deptList.length;
				const i = this.getRandomInt(0, length - 1);
				return this.deptList[i];
			},
			getReandomImage(i) {
				// const length = this.imageList.length;
				// const i = this.getRandomInt(0, length - 1);
				return '/static/aidex/images/' + this.imageList[i] + '.png';
				
			},
			navTo(url) {
				uni.navigateTo({
					url: url
				});
			},
		}
	};
</script>
<style lang="scss">
	@import 'index.scss';

	page {
		background-color: #f5f5f5;
	}

	.wrap .search {
		background: #ffffff;
	}

	.list-cell {
		display: flex;
		box-sizing: border-box;
		width: 100%;
		padding: 8px 24rpx;
		overflow: hidden;
		color: #323233;
		font-size: 14px;
		line-height: 24px;
		background-color: #fff;
		align-items: center;
		border-bottom: 1px solid #ececec !important;
	}

	.personal-listitem .list-cell:last-of-type {
		border-bottom: 0 !important;
	}

	.user-images {
		width: 80rpx;
		height: 80rpx;
		margin-right: 10px;
	}

	.user-name {
		font-size: 32rpx;
		color: #000000;
		flex: 1;

		span {
			display: block;
		}

		.user-other {
			font-size: 26rpx;
			color: #999999;
			font-weight: normal;
		}
	}
</style>
